---
title: "Tag Field"
description: An input component that allows users to enter, display, and manage multiple tags or keywords dynamically.
order: 9
published: true
references: ["https://react-spectrum.adobe.com/react-aria/TagGroup.html#props"]
---

## Basic

The basic tag field lets you add tags to your content.

<How toUse="forms/tag-field/tag-field-demo" />

## Installation

To install, run the following command:

```bash
npx shadcn@latest add @intentui/tag-field
```

## Composed components

This tag field integrates with components like:

<Composed components={['field', 'tag-group']} />

## Manual installation

For manual installation, use:

```bash
npm i react-aria-components
```

<SourceCode toShow='tag-field' />

## Anatomy
Import the components and use them as shown below, adapting the structure to fit each component.
```
import { Label } from "@/components/ui/field"
import { Input } from "@/components/ui/input"
import { TagField } from "@/components/ui/tag-field"
```

```
<TagField>
  <Label/>
  <Input/>
</TagField>
```
